<style lang="less" scoped src="./deansignup.less"></style>
<script src="./deansignup.js"></script>

<template>
    <div>
        <div>
            <Row class="query">
                <Col span="24">
                班级名称 ：<Input v-model="query.name" clearable style="width: 15%"></Input>
                学年  ：<Input v-model="query.year" clearable style="width: 10%"></Input>
                学期 ：
                <Select v-model="query.classSeason" clearable style="width: 10%">
                    <Option v-for="item in semesterList" :value="item.id" :key="item.id">{{item.name}}</Option>
                </Select>
                专业大类 ：
                <Select v-model="query.major" clearable style="width: 10%" @on-change="findByParent">
                    <Option v-for="item in LargeMajorList" :value="item.id" :key="item.id">{{item.name}}</Option>
                </Select>
                专业 ：
                <Select v-model="query.marjorId" clearable style="width: 10%">
                    <Option v-for="item in majorList" :value="item.id" :key="item.id">{{item.name}}</Option>
                </Select>
                部门  ：<Input v-model="query.departmentName"  :readonly="true" style="width: 17%"  @on-click="deptModal = true" icon="search"></Input>
                </Col>
            </Row>
            <Row class="query">
                <Col span="24">
                </Col>
            </Row>
            <Row class="query">
                <Col span="24">
                <span @click="loadList"><Button type="primary" icon="android-search">查询</Button></span>
                <span @click="refresh"><Button type="primary" icon="refresh">清空</Button></span>
                </Col>
            </Row>
            <div class="table-content">
                <Table border :columns="columns" :data="data"></Table>
            </div>
            <div class="pagination">
                <Page :total="total" size="small" :page-size="pageSize" :current.sync="pageIndex" @on-change="loadList"
                      show-total show-elevator></Page>
            </div>
        </div>
        <Modal v-model="signUpModal"
               title="教务报名"
               width="80%"
               height="100%"
               :scrollable="false"
               :styles="{top: '20px'}"
               :mask-closable="false">
            <div style="height: 580px;overflow-y: scroll">
                <Form  :label-width="80" :model="formData" :rules="formDataRules" ref="formData">
                    <Row>
                        <Col span="12">
                            <FormItem label="姓名:" prop="name">
                                <Row>
                                    <Col span="11">
                                        <Input type="text" v-model="formData.name" style="width: 200px" @on-blur="queryStudentByName"></Input>
                                    </Col>
                                    <Col span="12">
                                        <span @click="studentModal = true"><Button type="primary" size="small" icon="android-search">学员查询</Button></span>
                                        <span @click="resetStudent"><Button type="primary" size="small" icon="refresh">重置</Button></span>
                                    </Col>
                                </Row>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="性别:" prop="sex">
                                <Select v-model="formData.sex" style="width: 200px">
                                    <Option v-for="item in sexList" :value="item.id" :key="item.id">{{item.name}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="身份证号:" prop="cardcode">
                                <Input v-model="formData.cardcode" style="width: 200px" ></Input>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="出生日期:" prop="birthdate">
                                <DatePicker v-model="formData.birthdate" style="width: 200px"></DatePicker>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="家长姓名:" prop="parentname">
                                <Input v-model="formData.parentname"  style="width: 200px"></Input>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="家长手机号:" prop="parentphone">
                                <Input v-model="formData.parentphone"  style="width: 200px"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="家庭电话:" prop="familyphone">
                                <Input v-model="formData.familyphone" style="width: 200px" ></Input>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="学员英文名:" prop="ename">
                                <Input v-model="formData.ename" style="width: 200px"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="点到卡号:" prop="namingcode">
                                <Input v-model="formData.namingcode" style="width: 200px" ></Input>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="学生卡号:" prop="stundentcode">
                                <Input v-model="formData.stundentcode" style="width: 200px"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="家庭住址:" prop="familyaddress">
                                <Input type="textarea" :rows="2" v-model="formData.familyaddress"></Input>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="备注:" prop="remark">
                                <Input type="textarea" :rows="2" v-model="formData.remark"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="12">
                            <FormItem label="缴费有效时间:" prop="chargeValidity">
                                <DatePicker type="datetime" v-model="formData.chargeValidity" style="width: 200px"></DatePicker>
                            </FormItem>
                        </Col>
                        <Col span="12">
                            <FormItem label="开课时间:" prop="classStartTime">
                                <DatePicker type="date" v-model="formData.classStartTime"  style="width: 200px"></DatePicker>
                            </FormItem>
                        </Col>
                    </Row>
                </Form>
                <!--<div class="table">-->
                    <!--<div class="table-title"><span>学员信息</span></div>-->
                    <!--<div class="table-content">-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele"><span style="color: red">*</span>姓名：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.name" :clearable="!isRead" :readonly="isRead" @on-blur="queryStudentByName"></Input>-->
                            <!--<span @click="studentModal = true"><Button type="primary" size="small" icon="android-search">学员查询</Button></span>-->
                            <!--<span @click="resetStudent"><Button type="primary" size="small" icon="refresh">重置</Button></span>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele">性别：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Select v-model="formData.sex" :clearable="!isRead" :disabled="isRead">-->
                                <!--<Option v-for="item in sexList" :value="item.id" :key="item.id">{{item.name}}</Option>-->
                            <!--</Select>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele">身份证号：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.cardcode" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele">出生日期：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<DatePicker v-model="formData.birthdate" :editable="false" :clearable="!isRead" :readonly="isRead" style="width: 100%"></DatePicker>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--&lt;!&ndash;<Row class="table-Row">&ndash;&gt;-->
                            <!--&lt;!&ndash;<Col span="4" class="titele">就读年级：</Col>&ndash;&gt;-->
                            <!--&lt;!&ndash;<Col span="8" class="content">&ndash;&gt;-->
                            <!--&lt;!&ndash;<Select v-model="formData.gradeid" :clearable="!isRead" :disabled="isRead">&ndash;&gt;-->
                                <!--&lt;!&ndash;<Option v-for="item in gradeList" :value="item.id" :key="item.id">{{item.name}}</Option>&ndash;&gt;-->
                            <!--&lt;!&ndash;</Select>&ndash;&gt;-->
                            <!--&lt;!&ndash;</Col>&ndash;&gt;-->
                            <!--&lt;!&ndash;<Col span="4" class="titele">就读学校：</Col>&ndash;&gt;-->
                            <!--&lt;!&ndash;<Col span="8" class="content">&ndash;&gt;-->
                            <!--&lt;!&ndash;<Input v-model="formData.school" :clearable="!isRead" :readonly="isRead"></Input>&ndash;&gt;-->
                            <!--&lt;!&ndash;</Col>&ndash;&gt;-->
                        <!--&lt;!&ndash;</Row>&ndash;&gt;-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele">家长姓名：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.parentname" :clearable="!isRead" :readonly="isRead"></Input>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele"><span style="color: red">*</span>家长手机号：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.parentphone" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele">家庭电话：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.familyphone" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele">学员英文名：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.ename" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele">点到卡号：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.namingcode" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele">学生卡号：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input v-model="formData.stundentcode" :clearable="!isRead" :readonly="isRead" ></Input>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--<Row class="table-Row">-->
                            <!--<Col span="4" class="titele">家庭地址：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input type="textarea" :rows="2" v-model="formData.familyaddress" :clearable="!isRead" :readonly="isRead"></Input>-->
                            <!--</Col>-->
                            <!--<Col span="4" class="titele">备注：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<Input type="textarea" :rows="2" v-model="formData.remark" :clearable="!isRead" :readonly="isRead"></Input>-->
                            <!--</Col>-->
                        <!--</Row>-->
                        <!--<Row class="table-Row">-->
                            <!--&lt;!&ndash;<Col span="4" class="titele">是否就餐：</Col>&ndash;&gt;-->
                            <!--&lt;!&ndash;<Col span="8" class="content">&ndash;&gt;-->
                            <!--&lt;!&ndash;<Select v-model="formData.isEat" clearable>&ndash;&gt;-->
                                <!--&lt;!&ndash;<Option v-for="item in selectYesOrNo" :value="item.id" :key="item.id">{{item.name}}</Option>&ndash;&gt;-->
                            <!--&lt;!&ndash;</Select>&ndash;&gt;-->
                            <!--&lt;!&ndash;</Col>&ndash;&gt;-->
                            <!--<Col span="4" class="titele">缴费有效时间：</Col>-->
                            <!--<Col span="8" class="content">-->
                            <!--<DatePicker type="datetime" v-model="formData.chargeValidity" :editable="false" clearable style="width: 100%"></DatePicker>-->
                            <!--</Col>-->

                            <!--<Col span="4" class="titele"><span style="color: red">*</span>开课时间：</Col>-->
                            <!--<Col span="8" class="content">-->
                                <!--<DatePicker type="date" v-model="formData.classStartTime" :editable="false" clearable style="width: 100%"></DatePicker>-->
                            <!--</Col>-->
                        <!--</Row>-->
                    <!--</div>-->
                <!--</div>-->
                <div class="table">
                    <div class="table-title"><span>班级信息</span></div>
                    <div>
                        <Row class="table-Row">
                            <Col span="2" class="table-row-title">班级：</Col>
                            <Col span="4" class="table-row-content">{{classForm.name}}</Col>
                            <Col span="2" class="table-row-title">录取方式：</Col>
                            <Col span="4" class="table-row-content">{{classForm.classApply}}</Col>
                            <Col span="2" class="table-row-title">学年：</Col>
                            <Col span="4" class="table-row-content">{{classForm.classYear}}</Col>
                            <Col span="2" class="table-row-title">学期：</Col>
                            <Col span="4" class="table-row-content">{{classForm.classSeasonName}}</Col>
                        </Row>
                        <Row class="table-Row">
                            <Col span="2" class="table-row-title">专业：</Col>
                            <Col span="4" class="table-row-content">{{classForm.marjorName}}</Col>
                            <Col span="2" class="table-row-title">专业程度：</Col>
                            <Col span="4" class="table-row-content">{{classForm.marjorLevelName}}</Col>
                            <Col span="2" class="table-row-title">负责教师：</Col>
                            <Col span="4" class="table-row-content">{{classForm.mainTeacherName}}</Col>
                            <Col span="2" class="table-row-title">班级开课时间：</Col>
                            <Col span="4" class="table-row-content">{{classForm.classStarttime}}</Col>
                            <!--<Col span="2" class="titele">年级阶段：</Col>-->
                            <!--<Col span="4" class="content">{{classForm.classSchoolGradeName}}</Col>-->
                            <!--<Col span="2" class="titele">年龄范围：</Col>-->
                            <!--<Col span="4" class="content">{{classForm.classSchoolAge}}</Col>-->
                        </Row>
                        <Row class="table-Row">
                            <Col span="2" class="table-row-title">已选课次(节)：</Col>
                            <Col span="4" class="table-row-content">{{selectClassTimeDesc}}</Col>
                            <!--<Col span="4" class="table-row-content">{{classForm.classNo}}</Col>-->
                            <Col span="2" class="table-row-title">教学费(元)：</Col>
                            <Col span="4" class="table-row-content">{{classForm.teachCost}}</Col>
                            <Col span="2" class="table-row-title">教学费差价(元)：</Col>
                            <Col span="4" class="table-row-content">{{classForm.teachCostDiff}}</Col>
                            <Col span="2" class="table-row-title">教材费(元)：</Col>
                            <Col span="4" class="table-row-content">{{classForm.otherCost}}</Col>


                            <!--<Col span="4" class="content">{{this.selectClassTime==''?(selectClassTimeSelectedPrice+classForm.otherCost):(classForm.teachCost*selectClassTime+classForm.otherCost)}}</Col>-->
                        </Row>
                        <Row>
                                <Col span="2" class="table-row-title">总费用(元)：</Col>
                                <Col span="4" class="table-row-content">{{totalFee}}</Col>
                        </Row>
                        <!--<Row class="table-Row">-->
                        <!--<Col span="2" class="titele">课程安排：</Col>-->
                        <!--<Col span="22" class="content">{{classForm.name}}</Col>-->
                        <!--</Row>-->
                    </div>
                </div>
            </div>
            <div slot="footer">
                <Button type="primary" @click="signup" :loading="applying">报名</Button>
                <Button type="primary" @click="showApplyTime">选择课次</Button>
                <Button type="error" style="margin-left: 8px" @click="signUpModal = false">取消</Button>
            </div>
        </Modal>
        <Modal v-model="studentModal"
               title="学员列表"
               width="80%"
               :styles="{top: '20px'}"
               :mask-closable="false"
               @on-ok="setStudent"
               @on-cancel="studentModal = false">
            <div class="table-content">
                <student-list ref="student"></student-list>
            </div>
        </Modal>
        <Modal v-model="deptModal"
               title="部门列表"
               width="20%"
               :mask-closable="false">
            <custom-tree ref="dept"
                         url="/base/organize/findOrgAll"
                         :formData="{'orgid': baseuser.orgId}"
                         :showCheckbox="false"></custom-tree>
            <div slot="footer">
                <Button type="primary" @click="setDept">确认</Button>
                <Button type="error" style="margin-left: 8px" @click="cancelSelect">清空</Button>
            </div>
        </Modal>

        <Modal v-model="applyClassTimeVisible"
               title="请选择课次"
               width="500px"
               :mask-closable="false"
                @on-ok="whenSetClassTime"
        >
            <h3 style="color: red;margin-bottom: 20px;" >可以选择课次或者自己填写课次数量</h3>
            <applyclasstime ref="applyclasstime"></applyclasstime>
        </Modal>

        <Modal v-model="feeVisible"
               title="订单详情"
               width="100%"
               :mask-closable="false"
        >
            <orderdetails ref="orderdetails" :billId="billId"></orderdetails>
        </Modal>


    </div>
</template>